<template>
	<el-row>
		<el-col :span="4">
			<div class="other">
				其他应收账款结构
			</div>
		</el-col>
		<el-col :span="4">
			<div class="location">
				定位信息：p16
			</div>
		</el-col>
		<el-col>
			<table border="0" width="100%" style="text-align: left;margin-top: 10px;text-indent: 2em;">
				<tr style="border-top: 2px solid rgba(61,112,178,1);background-color: rgba(61,112,178,0.15);">
					<th width="40%">项目</th>
					<th width="30%">本期金额</th>
					<th width="30%">上期金额</th>
				</tr>
				<tr v-for="(item, index) in tableData">
					<td>{{item.project}}</td>
					<td @click="moneyUpdate(item, index)" style="cursor: pointer;" title="点击修改">{{item.money}}</td>
					<td>{{item.lastMoney}}</td>
				</tr>
			</table>
		</el-col>
	</el-row>
</template>

<script>
export default {
  name: 'shouldCredit',
  props: ['tableData'],
  data () {
    return {

    }
  },
  methods: {
    moneyUpdate (value, index) {
      this.$emit('changeMoney', value, index)
    }
  }
}
</script>

<style scoped="" type="text/css">
	.other {
		font-family: PingFangSC-Semibold;
		font-size: 14px;
		color: #666666;
		margin: 15px 0 5px;
	}

	.location {
		font-family: PingFangSC-Regular;
		font-size: 12px;
		color: #108EE9;
		text-align: left;
		margin: 15px 0 5px;
	}

	table tr {
		height: 30px;
		line-height: 30px;
		border-bottom: 1px solid rgba(233, 233, 233, 1);
	}

	table tr:first-child {
		border-bottom: none;
	}

	table tr:last-child {
		border-bottom: none;
	}

	table tr th {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #5A6872;
		font-weight: normal;
	}

	table tr td {
		ont-family: PingFangSC-Regular;
		font-size: 14px;
		color: #5A6872;
	}
</style>
